<template>
<!--     <div class="container">-->
        <nav class="td">
            <el-menu
                active-text-color="#ffd04b"
                class="el-menu-vertical-demo"
                default-active="1"
                text-color="#000"
                @open="handleOpen"
                @close="handleClose"
                router
                :default-openeds="['1','1-1']"
                >
                <el-sub-menu index="1" >
                    <template #title>
                        <el-icon><Suitcase /></el-icon>
                        <a><span>{{ $t('menu.serviceManager') }}</span></a>
<!--                        <span>{{ $t('menu.serviceManager') }}</span>-->
                    </template>
                    <el-sub-menu index="1-1">
                        <template #title>
                            <el-icon><Document /></el-icon>
                            {{ $t('menu.fileManager') }}
                        </template>
    
                        <el-menu-item index="/index/FilePage" v-hasPermissio="'cldk_file_All'">
                            <el-icon><Goods /></el-icon>
                            <span>{{ $t('menu.fileAll') }}</span>
                        </el-menu-item>
                        <el-menu-item index="/index/RecyclePage" v-hasPermissio="'cldk_file_offer'">
                            <el-icon><Basketball/></el-icon>
                            <span>{{ $t('menu.recyle') }}</span>
                        </el-menu-item>
                        <el-menu-item index="/index/SharePage" v-hasPermissio="'cldk_file_sto'">
                            <el-icon><Help/></el-icon>
                            <span>{{ $t('menu.myShare') }}</span>
                        </el-menu-item>
                        <el-menu-item index="/index/receiveShare" v-hasPermissio="'cldk_file_quote'">
                            <el-icon><Calendar/></el-icon>
                            <span>{{ $t('menu.receiveShare') }}</span>
                        </el-menu-item>
                        <el-menu-item index="/index/myCollection" v-hasPermissio="'cldk_file_gdp'">
                            <el-icon><OfficeBuilding/></el-icon>
                            <span>{{ $t('menu.myCollection') }}</span>
                        </el-menu-item>
                    </el-sub-menu>
                </el-sub-menu>
            </el-menu>
          <!-- <RouterLink class="btn" to="/index/FilePage">文件管理</RouterLink> -->
           </nav>
           <RouterView></RouterView>
<!--     </div>-->
   </template>
<script>
import {Suitcase,Document,Goods,Basketball,Help,Calendar,OfficeBuilding} from '@element-plus/icons-vue'
    export default {
    name: '',
    components:{
        Suitcase,
        Document,
        Goods,
        Basketball,
        Help,
        Calendar,
        OfficeBuilding,

    },
    data: function(){
    return {
       
    }
    },
    methods:{
        

    }
    }
   </script>
   <style scoped>
       .container{
           display: flex;
           flex-direction: column;
           align-items: center;
           justify-content: center;
           width: 100%;
           height: 100%;
           background-color: aliceblue;
       }
       .tr{
           width: 200px;
           flex-basis: 50px;
           display: flex;
           flex-direction: row;
           justify-content: space-between;
           background-color: beige;
           align-items: center;
       }
       .second{
           background-color: aqua;
       }
       .td{
        display: flex;
        flex-basis: 100px;
        flex-direction: column;
          
       }
   </style>
